<template>
  <span style="text-align: center; font-size: 20px; font-weight: 600"
    >注册</span
  >
  <div>
    <el-form :model="form" label-width="auto" style="max-width: 600px">
      <el-form-item label="请输入用户名称">
        <el-input v-model="form.userName" />
      </el-form-item>
      <el-form-item label="请输入密码">
        <el-input v-model="form.userPwd" />
      </el-form-item>
      <el-form-item label="请确认密码">
        <el-input v-model="forma.userPwda" />
      </el-form-item>
      <el-form-item label="请选择角色">
        <el-select v-model="form.roleId">
          <el-option label="请选择" :value="0" />
          <el-option
            v-for="item in ShowRoleData"
            :key="item.roleId"
            :label="item.roleName"
            :value="item.roleId"
          />
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="AddUser">添加</el-button>
        <el-button @click="ent">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script setup lang="ts">
import { reactive, ref, onMounted } from "vue";
import axios from "axios";
import { useRouter } from "vue-router";
const router = useRouter();
import { ElMessage } from "element-plus";
const apiurls = import.meta.env.VITE_APP_API_URL_RBACShow;
const apiurla = import.meta.env.VITE_APP_API_URL_RBACAdd;
const forma = reactive({
  userPwda: "",
})
//权限添加的form
const form = reactive({
  userId: 0,
  userName: "",
  userPwd: "",
  userState: true,
  isDelete: false,
  userRoleId: 0,
  roleId: 0,
  handle: "MaxAdmin",
  handleContext: "添加用户信息",
  handleTime: new Date(),
  pid: 0,
});
//取消
const ent = () => {
  form.userName = "";
  form.userPwd = "";
};
//添加角色
const AddUser = () => {
  if(form.userPwd != forma.userPwda){
    ElMessage.error("两次密码不一致");
    return;
  }
  if (form.userPwd == "") {
    ElMessage.error("请输入密码");
    return;
  }
  if (form.userName == "") {
    ElMessage.error("请输入用户名称");
    return;
  }
  if(form.userName == "MaxAdmin"){
    form.handle = "本人";
  }
  else{
    form.handle = "MaxAdmin";
  }
  axios.post(apiurla + "/api/RBAC/AddUsersData", form).then((res: any) => {
    console.log(res.data);
    ElMessage.success(res.data.msg);
  });
};
//绑定角色下拉
const ShowRoleData: any = ref([]);
const ShowRole = () => {
  const data = {};
  axios.post(apiurls + "/api/RBACs/ShowRoleData", data).then((res: any) => {
    ShowRoleData.value = res.data.data;
  });
};
//页面初始化
onMounted(() => {
  ShowRole();
});
</script>

<style scoped></style>
